<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <title>Google Maps API Example - Custom Control with Custom Map Types</title>

    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxQGj0PqsCtxKvarsoS-iqLdqZSKfxRdmoPmGl7Y9335WLC36wIGYa6o5Q&amp;sensor=false" type="text/javascript"></script>

<script type="text/javascript">
// Load packed or unpacked version of library script
  document.write('<' + 'script type="text/javascript" src="../src/extmaptypecontrol' + (document.location.search.indexOf('packed')>-1?'_packed':'') +'.js"><'+'/script>');
</script>


    <script type="text/javascript">

    function loadMap() {
      if (GBrowserIsCompatible()) {
          var map = new GMap2(document.getElementById("map"));
          map.setCenter(new GLatLng(37.441944, -122.141944), 13);
          map.removeMapType(G_NORMAL_MAP);
          var copyright = new GCopyright(1, new GLatLngBounds(new GLatLng(-90, -180), new GLatLng(90, 180)), 0, 'owned by NASA');
          var copyrights = new GCopyrightCollection('The Blue Marble Imagery');
          copyrights.addCopyright(copyright);
          var tilelayer = new GTileLayer(copyrights, 0, 17);
          tilelayer.getTileUrl = function(tile, zoom) { return "blue_marble.jpg"; };
          var CUSTOM_MAP = new GMapType( [tilelayer], new GMercatorProjection(20), "NASA" );
          map.addMapType(CUSTOM_MAP);
          map.setMapType(G_SATELLITE_MAP);
          // ExtMapTypeControl should always be added after
          // adding, removing or setting a map type
          map.addControl(new ExtMapTypeControl( {useMapTypes: true }));
      }
    }
    </script>
  </head>

  <body onload="loadMap()" onunload="GUnload()">

<p><a href="?packed">Packed</a>&nbsp;|&nbsp;<a href="?">Unpacked</a> version of the script.</p>

    <div id="map" style="width: 600px; height: 400px"></div>
  </body>
</html>
